<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<title>问题件扫描</title>
	<meta name="viewport"
		  content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" th:href="@{/css/oksub.css}">
	<script type="text/javascript" th:src="@{/lib/loading/okLoading.js}"></script>
</head>
<body>
<div class="ok-body">
	<blockquote class="layui-elem-quote quoteBox">
		<form class="layui-form" lay-filter="searchForm">
		</form>
	</blockquote>
	<!--数据表格-->
	<table class="layui-hide" id="tableId" lay-filter="tableFilter"></table>
</div>
<!--js逻辑-->
<script th:src="@{/lib/layui/layui.js}"></script>
<script th:inline="none">
	layui.use(["element", "jquery", "table", "form", "laydate", "okLayer", "layer",
		"okUtils", "okMock"], function () {
		var table = layui.table;
		var form = layui.form;
		layer = layui.layer;
		var laydate = layui.laydate;
		var okLayer = layui.okLayer;
		var okUtils = layui.okUtils;
		var okMock = layui.okMock;
		var $ = layui.jquery;

		laydate.render({
			elem: "#startTime",
			type: "datetime"
		});
		laydate.render({
			elem: "#endTime",
			type: "datetime"
		});
		okLoading.close($);
		var userTable = table.render({
			elem: '#tableId',
			url: "/api/custService/proList",
			limit: 20,
			page: true,
			toolbar: true,
			toolbar: "#toolbarTpl",
			size: "sm",
			cols: [[{
				type: "checkbox",
				fixed: "left"
			}, {
				field: "id",
				title: "扫描编号",
				width: 100,
				sort: true
			}, {
				field: "waybillNumber",
				title: "运单编号",
				width: 100
			}, {
				field: "expressTypeName",
				title: "快件类型",
				width: 120
			}, {
				field: "itemTypeName",
				title: "物品类型",
				width: 150
			}, {
				field: "senderClient",
				title: "寄件人",
				width: 150
			}, {
				field: "receiver",
				title: "收件人",
				width: 100
			}, {
				field: "transportMethodName",
				title: "运输方式",
				width: 100
			}, {
				field: "paymentMethodName",
				title: "付款方式",
				width: 100
			}, {
				field: "sendNetworkName",
				title: "寄件网点",
				width: 100
			}, {
				field: "weight",
				title: "重量",
				width: 100
			}, {
				field: "takerName",
				title: "取件员",
				width: 100
			}, {
				field: "destinationName",
				title: "目的地",
				width: 100
			},{
				field: "scanNetworkName",
				title: "目的网点",
				width: 100
			},
				{
					title: "操作",
					width: 250,
					align: "center",
					fixed: "right",
					templet: "#operationTpl"
				}]],
			done: function (res, curr, count) {
				console.info(res, curr, count);
			}
		});

		table.on("tool(tableFilter)", function (obj) {
			var data = obj.data;
			switch (obj.event) {
				case "proLogin":
					proLogin(data);
					break;

			}
		});

		function proLogin(data) {
			var index = layui.layer.open({
				title: "问题件登记",
				type: 2,
				content: "/page/proLogin",
				success: function (layero, index) {
					var body = layui.layer.getChildFrame('body', index);
					body.find("#hiddenEdit").val(JSON.stringify(data));
					setTimeout(function () {
						layui.layer.tips('点击此处返回角色列表',
								'.layui-layer-setwin .layui-layer-close', {
									tips: 3
								});
					}, 500)
				}
			})
			layui.layer.full(index);
			//改变窗口大小时，重置弹窗的宽高，防止超出可视区域（如F12调出debug的操作）
			$(window).on("resize", function () {
				layui.layer.full(index);
			})
		}

		function handle(id) {
			$.get("/api/scan/problemScanHandle", {
				id: id
			}, function (data) {
				if (data.code == 0) {
					layer.msg("登记成功", {"icon": 1});
					userTable.reload(); //刷新表格数据（也即让table重新加载url）
					layer.close(index);//关闭弹出框
				} else {
					layer.close(index);//关闭弹出框
					layer.msg(data.msg, {
						icon: 2
					});
				}
			})
		}


	})
</script>


<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
	<a href="javascript:" title="问题件登记" lay-event="proLogin"><i class="layui-icon">&#xe642;</i></a>
</script>


</body>
</html>
